import Vue from "vue";
import VueRouter from "vue-router";
// 引入
// import Home from "@/components/Home/Home.vue";
// import Vip from "@/components/Vip/Vip.vue";
// import Cart from "@/components/Cart/Cart.vue";
// import Search from "@/components/Search/Search.vue";
// // 新闻组件
// import NewsList from "@/components/News/NewsList.vue";
// // 新闻——子组件
// import NewsDetail from '@/components/News/NewsDetail.vue';
// // 图文分享组件
// import PhotoList from '@/components/PhotoList/PhotoList.vue';
// /* 图文分享——子组件 */
// import PhotoDetail from '@/components/PhotoList/PhotoDetail.vue';

// /* 留言反馈 */
// import MessageFeedback from '@/components/MessageFeedback/MessageFeedback.vue';

// /* 商品展示 */
// import GoodsList from '@/components/GoodsList/GoodsList.vue';
// /* 商品展示——子组件 */
// import GoodsDetail from '@/components/GoodsList/GoodsDetail.vue';

// /* 购物车评论组件 */
// import GoodsComment from '@/components/GoodsList/GoodsComment.vue';

// 按需加载   路由 懒加载
const Home = ()=>import( "@/components/Home/Home.vue");
const Vip = ()=>import( "@/components/Vip/Vip.vue");
const Cart = ()=>import( "@/components/Cart/Cart.vue");
const Search = ()=>import( "@/components/Search/Search.vue");
const NewsList = ()=>import( "@/components/News/NewsList.vue");
const NewsDetail = ()=>import( '@/components/News/NewsDetail.vue');
const PhotoList = ()=>import( '@/components/PhotoList/PhotoList.vue');
const PhotoDetail = ()=>import( '@/components/PhotoList/PhotoDetail.vue');
const MessageFeedback = ()=>import( '@/components/MessageFeedback/MessageFeedback.vue');
const GoodsList = ()=>import( '@/components/GoodsList/GoodsList.vue');
const GoodsDetail = ()=>import( '@/components/GoodsList/GoodsDetail.vue');
const GoodsComment = ()=>import( '@/components/GoodsList/GoodsComment.vue');



// 使用 vue-router 插件 Vue.prototype.$router = Router;
Vue.use(VueRouter);

// 匹配的路由规则
const routes = [
  {
    path: "/",
    redirect: "/home"
  },
  {
    path: "/home",
    name: "home",
    component: Home
  },
  {
    path: "/vip",
    name: "vip",
    component: Vip
  },
  {
    path: "/cart",
    name: "cart",
    component: Cart
  },
  {
    path: "/search",
    name: "search",
    component: Search
  },
  {
    path: "/news/list",
    name: "news.list",
    component: NewsList
  },
  {
    path: "/news/detail",
    name: "news.detail",
    component: NewsDetail,
    props: {
      title: '新闻详情'
    }
  },
  {
    path: "/photos/list/:categoryId",
    name: "photo.list",
    component: PhotoList
  },
  {
    /* 原： path: "/photos/detail/:newUrl "  删除 /:newurl  隐藏地址栏参数  */
    path: "/photos/detail/newurl",
    name: "photo.detail",
    component: PhotoDetail
  },
  /* 留言反馈 */
  {
    path: "/MessageFeedback",
    name: "MessageFeedback",
    component: MessageFeedback
  },
  // 商品列表
  {
    path: "/goods/list",
    name: "goods.list",
    component: GoodsList
  },
  {
    path: "/goods/detail",
    name: "goods.detail",
    component: GoodsDetail
  },
  {
    path: "/goods/photo/info",
    name: "goods.info",
    component: NewsDetail,
    props: {
      title: '图文介绍'
    }
  },
  {
    path:"/goods/comment",
    name: "goods.comment",
    component: GoodsComment
  }
];

const router = new VueRouter({
  mode: "history",
  base: process.env.BASE_URL,
  routes,
  linkActiveClass: 'link-active'
});

export default router;
